<template>
  <div class="">
    <!-- <ProtectFakeData :fakeData="disputeFakeData"></ProtectFakeData> -->
    <div class="table">
      <div class="title">{{title}}</div>
      <div class="form">
        <CommonForm :tableForm="tableForm" />
      </div>
      <div class="btn">
        <a-button class="submit" @click="submit">提交</a-button>
        <a-button @click="resetClick">重置</a-button>
      </div>
    </div>
  </div>
</template>

<script>
// import ProtectFakeData from '../../components/pageComponents/protectFakeData.vue'
// import { disputeFakeData } from '../config.js'
import CommonForm from '@/components/commonForm'
import {disputeApply} from '@/api/protectionOfRights'
import FrontMixins from '@/mixins/frontMixin'

export default {
  mixins: [FrontMixins],
  data() {
    return {
      // disputeFakeData,
      title: '佛山市知识产权纠纷人民调解申请书',
      tableForm: [
        [
          {span:8,label:'申请人单位名称或姓名'},
          {span:16,value:'',props:'applicant',}
        ],
        [
          {span:3,label:'负责人姓名'},
          {span:5,value:'',props:'operator'},
          {span:3,label:'性别'},
          {span:5,value:'',props:'sex'},
          {span:3,label:'民族'},
          {span:5,value:'',props:'national'},
        ],
        [
          {span:3,label:'年龄'},
          {span:5,value:'',props:'age'},
          {span:3,label:'职业或职务',noRequired: true},
          {span:5,value:'',props:'job'},
          {span:3,label:' 联系方式'},
          {span:5,value:'',props:'contact'},
        ],
        [
          {span:3,label:'单位地址或住址'},
          {span:21,value:'',props:'address'}
        ],
        [
          {span:8,label:'被申请人单位名称或姓名'},
          {span:16,value:'',props:'respondent'}
        ],
        [
          {span:3,label:'负责人姓名'},
          {span:5,value:'',props:'rOperator'},
          {span:3,label:'性别'},
          {span:5,value:'',props:'rSex'},
          {span:3,label:' 民族'},
          {span:5,value:'',props:'rNational'},
        ],
        [
          {span:3,label:'年龄'},
          {span:5,value:'',props:'rAge'},
          {span:3,label:'职业或职务',noRequired: true},
          {span:5,value:'',props:'rJob'},
          {span:3,label:'联系方式'},
          {span:5,value:'',props:'rContact'},
        ],
        [
          {span:3,label:'单位地址或住址'},
          {span:21,value:'',props:'rAddress'}
        ],
        [
          {span:3,label:'纠纷简要情况'},
          {span:21,value:'',props:'brief',type:'textarea'}
        ],
        [
          {span:3,label:'当事人申请事项'},
          {span:21,value:'',props:'apply',type:'textarea'}
        ],
      ],
      tableFormCopy: [],
    }
  },
  components: {
    // ProtectFakeData,
    CommonForm
  },
  created() {
    this.tableFormCopy = JSON.parse(JSON.stringify(this.tableForm))
  },
  methods: {
    resetClick() {
      this.tableForm = JSON.parse(JSON.stringify(this.tableFormCopy))
    },
    submit () {
      if (this.authorityManagement()) {
        return
      }
      let isRequired = true
      let checkForm = [
        {props: 'contact',checkRules:/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/,message:'请填写正确的申请人单位联系方式!'},
        {props: 'rContact',checkRules:/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/,message:'请填写正确的被申请人单位联系方式!'},
      ]
      this.tableForm.forEach(item=>{
        item.forEach(ele=>{
          if(ele.props && !ele.noRequired && ele.value === '') {
            isRequired = false
          }
          checkForm.forEach(res=>{
            if(res.props === ele.props) {
              if(!res.checkRules.test(ele.value)) {
                this.$message.warning(res.message)
              }
            }
          })
        })
      })
      
      if(!isRequired) {
        this.$message.warning('有必填或必选项没有填写或选择。')
        return
      }
      
      this.$confirm({
        title: '一旦提交不可修改，请认真检查，是否确认提交；是，就提交上去；否，返回检查可继续修改表单',
        onOk:()=> {
          let obj = {}
          this.tableForm.forEach(item => {
            item.forEach(ele => {
              if (ele.props) {
                obj[`${ele.props}`] = ele.value
              }
            })
          })
          obj.sex = obj.sex==='男'?'1':'0'
          obj.rSex = obj.rSex==='男'?'1':'0'
          
          disputeApply(obj).then(res=>{
            let {code,msg} = res
            if(code === 200) {
              this.$message.success(`您已成功提交${this.title}业务申请`,5)
              this.resetClick()
            }else{
              this.$message.error(msg)
            }
          })
        },
        onCancel() {
        },
        class: 'test',
      });
    },
  }
}
</script>